<template>
	<view class="content">
		<uni-steps :options="list1" active-color="#007AFF" :active="active" />
		<view class="card">
			<view class="left">
				<view class="name">
					蒋峰
				</view>
				<view class="info">
					<text>住院号</text>
					<text>400909</text>
				</view>
				<view class="info">
					<text>入院时间</text>
					<text>2020/10/09</text>
				</view>
				<view class="info">
					<text>出院时间</text>
					<text>2020/10/09</text>
				</view>
			</view>
			<view class="right">
				<text>
					已出院
				</text>
			</view>
		</view>
		<!-- <view class="sel">
			<view class="name">
				选择复印内容
			</view>
			<view class="item">
				<view class="title">
					<text>病案首页</text>
					<text style="color: #feb200;margin-left: 20rpx;">(2元)</text>
				</view>
				<view class="count">
						<uni-number-box :value="five" @change="change" />
				
				</view>
			</view>
			<view class="item">
				<view class="title">
					<text>出院记录</text>
					<text style="color: #feb200;margin-left: 20rpx;">(3元)</text>
				</view>
				<view class="count">
						<uni-number-box :value="six" @change="change" />
				
				</view>
			</view>
			<view class="item">
				<view class="title">
					<text>入院记录</text>
					<text style="color: #feb200;margin-left: 20rpx;">(3元)</text>
				</view>
				<view class="count">
						<uni-number-box :value="seven" @change="change" />
				
				</view>
			</view>
			<view class="item">
				<view class="title">
					<text>手术记录</text>
					<text style="color: #feb200;margin-left: 20rpx;">(2元)</text>
				</view>
				<view class="count">
						<uni-number-box :value="eight" @change="change" />
				
				</view>
			</view>
			<view class="item">
				<view class="title">
					<text>麻醉记录</text>
					<text style="color: #feb200;margin-left: 20rpx;">(1元)</text>
				</view>
				<view class="count">
						<uni-number-box :value="one" @change="change" />
				
				</view>
			</view>
			<view class="item">
				<view class="title">
					<text>病理报告</text>
					<text style="color: #feb200;margin-left: 20rpx;">(1元)</text>
				</view>
				<view class="count">
						<uni-number-box :value="two" @change="change" />
				
				</view>
			</view>
			<view class="item">
				<view class="title">
					<text>化验报告</text>
					<text style="color: #feb200;margin-left: 20rpx;">(1元)</text>
				</view>
				<view class="count">
						<uni-number-box :value="three" @change="change" />
				
				</view>
			</view>
			<view class="item">
				<view class="title">
					<text>医嘱</text>
					<text style="color: #feb200;margin-left: 20rpx;">(4元)</text>
				</view>
				<view class="count">
						<uni-number-box :value="four" @change="change" />
				</view>
			</view>
		</view> -->
		<view class="expense">
			<view>
				<text>
					合计：
					<text>{{addInfo.total}}元</text>
				</text>
			</view>
			<view @click="goaymPentInformation"><text>结算</text></view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive,onMounted
	} from 'vue'
	import {
			onLoad
		} from '@dcloudio/uni-app';
	import {addSendApi } from '@/api/nucleicAcidApi'
	let active = ref(2)
	let list1 = reactive([{
			title: '申请信息'
		},
		{
			title: '证件上传'
		},
		{
			title: '病历信息'
		}
	])
	let total = ref(60)
	let one=ref(1)
	let two=ref(1)
	let three=ref(1)
	let four=ref(1)
	let five=ref(1)
	let six=ref(1)
	let seven=ref(1)
	let eight=ref(1)
	let change = function(value){
		if(one.value>0){
			one.value = value
		}else{
			one.value=0
		}
		
			
		}
		
		const goaymPentInformation = () => {
			uni.navigateTo({
				url: '/pages/TopUpOnline/OutpatientTopUp/OutpatientTopUp'
			})
		}
		let obj=reactive({})
		let plusInfo=reactive({})
	onLoad((option) => {
			console.log(JSON.parse(decodeURIComponent(option.ob)),'dfs')
			obj=option.ob
			plusInfo={obj,addInfo}
			console.log(plusInfo,23324)
			onMounted(async () => {
				let res = await addSendApi(plusInfo)
				if (res.data.code == 0) {
					console.log('成功！')
				}
			})
		})
	let addInfo=reactive({
		total:60
	})
</script>

<style lang="less">
	.content {

		margin: 50rpx 30rpx;

		.card {
			padding: 40rpx 30rpx;
			background-color: #f5f9ff;
			display: flex;
			justify-content: space-between;
			align-items: baseline;

			.left {
				height: 300rpx;
				display: flex;
				flex-direction: column;
				justify-content: space-evenly;

				.name {}

				.info {
					color: #aeafaf;
					font-size: 25rpx;
				}

				text {
					margin-right: 20rpx;
				}
			}

			.right {
				display: flex;
				line-height: 40rpx;
				text-align: center;

				text {
					border-radius: 20rpx;
					width: 100rpx;
					height: 40rpx;
					background-color: #c5efe6;
					color: #03ca82;
					font-size: 20rpx;
				}
			}
		}
		.sel{
			margin: 30rpx 0 100rpx 0;
			.name{
				
			}
			.item{
				margin: 30rpx 0;
				display: flex;
				justify-content: space-between;
				align-items: center;
				.title{
					
				}
				.count{
					
				}
			}
		}
		.expense{
			position: fixed;
			bottom: 0;
			width: 750rpx;
			height: 100rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			background-color: #ffffff;
		
			view {
				flex: 1;
				height: 100%;
				display: flex;
				justify-content: center;
				align-items: center;
				font-weight: 600;
				font-size: 30rpx;
		
				&:nth-child(1) {
					text {
						font-size: 25rpx;
		
						text {
							color: #f35a58;
							font-size: 30rpx;
						}
					}
				}
		
				&:nth-child(2) {
					background-color: #006eff;
					color: #fff;
				}
			}
		}

	}
</style>
